import { useState } from "react"
import MyClassComponent2 from "../component/MyClassComponent2"
import MyClassComponent from "../component/render-demo/MyClassComponent"
import MyFunctionComponent from "../component/render-demo/MyFunctionComponent"
const RenderDom=()=>{
    const [name,setName]=useState('c1')
    return(
        <>
        <input type='text' value={name} onChange={(e)=>{
            setName(e.target.value)
        }}/>
        {name}
        <h2>class 组件</h2>
        <MyClassComponent name='c1'/>
        <h2>function 组件 </h2>
        <MyFunctionComponent name='c2' />
        <h2>pure class组件</h2>
        <MyClassComponent2  name='c4'/>
        <h2>memo 组件</h2>
        <MyClassComponent2 name='c6'/>
</>
    )
}
export default RenderDom